<template>
	<view>
		<u-navbar title="支付记录">
			<view slot="right">
				<view style="margin-right: 20rpx;"@click="deleteClick">
					<u-icon name="trash" size="40" color="#000"></u-icon>
				</view>
			</view>
		</u-navbar>
		<u-card v-for="(item,index) in payment" :key="index" boxShadow="0 0 10rpx 5rpx #F8F8F8">
			<view slot="head" class="u-flex">
				<image src="../../../../static/xianxingxihongshi.png" mode="aspectFill"
				style="width: 50rpx;height: 50rpx;margin-right: 10rpx;"></image>
				<view>{{item.title}}</view>
			</view>
			<view slot="body">
				<view style="text-align: center;">
					<view style="color: #999999;">付款金额</view>
					<h3 style="color: #000000;font-size: 50rpx;padding: 10rpx;">￥{{item.payment}}</h3>
				</view>
				<view style="padding: 10rpx;">
					<text style="color: #999999;margin-right: 20rpx;">付款方式</text>
					<text>零钱</text>
				</view>
				<view style="padding: 10rpx;">
					<text style="color: #999999;margin-right: 20rpx;">收单机构</text>
					<text>湖南衡阳xxxxx学院xxxxx学生</text>
				</view>
				<view style="padding: 10rpx;">
					<text style="color: #999999;margin-right: 20rpx;">交易时间</text>
					<text>{{item.time | formatDate}}</text>
				</view>
			</view>
		</u-card>
		<view v-if="payment.length == 0" style="text-align: center;margin-top: 100rpx;">
			<text style="color: #999999;font-size: 36rpx;">暂无支付记录</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				payment:[]
			}
		},
		methods: {
			deleteClick(){
				uni.showModal({
					title:"确认删除所有支付记录？",
					confirmColor:"#E27037",
					success: (res) => {
						console.log(res)
						if(res.confirm){
							uni.removeStorageSync("vipPayment")
							uni.showToast({
								title:"删除成功",
								icon:"none",
								position:"top",
								success: (res) => {
									setTimeout(()=>{
										uni.navigateBack({
											
										})
									},1000)
								}
							})
						}
					}
				})
			}
		},
		onLoad() {
			this.payment = uni.getStorageSync("vipPayment")
			console.log(this.payment)
		},
		filters: {
		  numFilter (value) {
		    // 截取当前数据到小数点后两位
		    let realVal = parseFloat(value).toFixed(2)
		    return realVal
		  },
		  formatDate(value) {
		  	if(value == undefined){
		  		return;
		  	}
		  	// let date = new Date(value * 1000);
		  	let date = new Date(value);
		  	//时间戳为10位需*1000，时间戳为13位的话不需乘1000
		  	let y = date.getFullYear();
		  	let MM = date.getMonth() + 1;
		  	MM = MM < 10 ? ('0' + MM) : MM; //月补0
		  	let d = date.getDate();
		  	d = d < 10 ? ('0' + d) : d; //天补0
		  	let h = date.getHours();
		  	h = h < 10 ? ('0' + h) : h; //小时补0
		  	let m = date.getMinutes();
		  	m = m < 10 ? ('0' + m) : m; //分钟补0
		  	let s = date.getSeconds();
		  	s = s < 10 ? ('0' + s) : s; //秒补0
		  	// return y + '-' + MM + '-' + d; //年月日
		  	return y + '-' + MM + '-' + d + ' ' + h + ':' + m+ ':' + s; //年月日时分秒
		  }
		}
	}
</script>

<style>
	
</style>
